<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 9/25
  Time: 10:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<!DOCTYPE html>
<html>
<head>
    <title>查看评论</title>
    <%@include file="common/headers.jsp" %>
    <link rel="stylesheet" href="static/css/main.css">
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
    <script src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
    <script>
        toastr.options = {
            "closeButton": true, //是否显示关闭按钮
            "debug": false, //是否使用debug模式
            "positionClass": "toast-bottom-right",//弹出窗的位置
            "showDuration": "300",//显示的动画时间
            "hideDuration": "1000",//消失的动画时间
            "timeOut": 0, //展现时间，一直存在
            "extendedTimeOut": "1000",//加长展示时间
            "showEasing": "swing",//显示时的动画缓冲方式
            "hideEasing": "linear",//消失时的动画缓冲方式
            "showMethod": "fadeIn",//显示时的动画方式
            "hideMethod": "fadeOut" //消失时的动画方式
        };

    </script>
</head>
<body>
<header class="header" id="site-header">
    <div class="page-title"><h3><a href="index.jsp">各大未来总裁交流博客</a></h3></div>
    <div class="header-content-wrapper">
        <div class="control-block">

            <div class="author-page author vcard inline-items more">
                <div class="author-thumb">
                    <!--头像-->
                    <img style="width: 36px;height: 36px;" alt="author" src="/upload/${user.pic}"
                         class="avatar">
                    <span class="icon-status online"></span>
                    <div class="more-dropdown more-with-triangle">
                        <div class="mCustomScrollbar ps ps--theme_default ps--active-y" data-mcs-theme="dark"
                             data-ps-id="36d9d401-1181-d38f-f95a-ee75bfab3fe5">
                            <div class="ui-block-title ui-block-title-small"><h6 class="title">Your Account</h6></div>
                            <ul class="account-settings">
                                <li><a href="36-FavPage-SettingsAndCreatePopup.html">
                                    <span class="glyphicon glyphicon-edit"></span>
                                    <span>修改信息</span></a></li>
                                <li>
                                    <a href="logout">
                                        <span class="glyphicon glyphicon-log-out"></span>
                                        <span>退出登录</span>
                                    </a>
                                </li>
                            </ul>

                        </div>
                    </div>
                </div>

                <a href="02-ProfilePage.html" class="author-name fn">
                    <div class="author-title">${sessionScope.user.nickName}</div>
                    <span class="author-subtitle">SPACE COWBOY</span>
                </a>
            </div>
        </div>
    </div>
</header>
<div class="header-spacer"></div>
<div class="container">
    <main class="col col-xl-6 col-lg-12 order-lg-1 col-md-12 col-sm-12 col-12">
        <div class="row messages">

            <div class="ui-block">
                <!--主留言-->
                <article class="hentry post">
                    <div class="post__author author vcard inline-items">
                        <input type="hidden" name="messageId" value="${requestScope.vo.id}">
                        <!--头像-->
                        <img src="/upload/${vo.pic}" alt="author">
                        <div class="author-date">
                            <a class="nickName h6 post__author-name fn" href="#">${requestScope.vo.nickName}</a>
                            <div class="post__date">
                                <time class="published"> ${requestScope.vo.dateDialect}</time>
                            </div>
                        </div>
                    </div>
                    <p>${requestScope.vo.content}</p>

                    <!--发表评论-->
                    <div class="tab-pane discuss-panel" role="tabpanel" aria-expanded="true">
                        <form id="discuss-form">
                            <div class="form-group is-empty">
                                <textarea name="content" class="form-control"></textarea>
                            </div>
                            <button class="btn btn-primary btn-md-2 disabled commit-discuss">发布</button>
                        </form>
                    </div>

                </article>

                <!--评论列表-->
                <ul class="comments-list">
                       <%-- <li class="comment-item">
                            <div class="post__author author vcard inline-items">
                                <img src="http://v.bootstrapmb.com/2019/6/mmjod5239/img/avatar10-sm.jpg" alt="author">
                                <div class="author-date">
                                    <a class="h6 post__author-name fn" href="02-ProfilePage.html">
                                        评论人昵称
                                    </a>
                                    <div class="post__date">
                                        <time class="published" datetime="2004-07-24T18:18"> 评论的时间</time>
                                    </div>
                                </div>
                                <a href="#" class="more">
                                    <span class="glyphicon glyphicon-thumbs-up"></span>
                                    <span>24</span>
                                </a>
                            </div>
                            <p>评论的内容</p>

                            <a href="javascript:void(0);" class="reply">
                                <span class="glyphicon glyphicon-edit"></span> 回复
                            </a>
                        </li>--%>

                </ul>
                <a href="#" class="more-comments">查看更多评论 <span>+</span></a>
            </div>

        </div>
    </main>
</div>
</body>
<script src="static/js/details.js"></script>
<script>
    $(function(){
        //页面加载完成后，立刻加载当前留言的评论信息
        $.get('discuss',{
            messageId: $('[name="messageId"]').val()
        },function(response){
            var datas = response.data;
            console.log(datas);
            for(var index in datas){
                var template = '<li class="comment-item">\n' +
                    '                            <div class="post__author author vcard inline-items">\n' +
                    '                                <img style="width: 40px;height: 40px;" src="/upload/'+ datas[index]["pic"] + '" alt="author">\n' +
                    '                                <div class="author-date">\n' +
                    '                                    <a class="h6 post__author-name fn" href="02-ProfilePage.html">\n' +
                                                            datas[index]["nickName"] +
                    '                                    </a>\n' +
                    '                                    <div class="post__date">\n' +
                    '                                        <time class="published" datetime="2004-07-24T18:18">  ' +
                                                            datas[index]["dateDialect"] + '</time>\n' +
                    '                                    </div>\n' +
                    '                                </div>\n' +
                    '                                <a href="#" class="more">\n' +
                    '                                    <span class="glyphicon glyphicon-thumbs-up"></span>\n' +
                    '                                    <span>24</span>\n' +
                    '                                </a>\n' +
                    '                            </div>\n' +
                    '                            <p>'+ datas[index]["content"] + '</p>\n' +
                    '\n' +
                    '                            <a href="javascript:void(0);" class="reply">\n' +
                    '                                <span class="glyphicon glyphicon-edit"></span> 回复\n' +
                    '                            </a>\n' +
                    '</li>';
                $('.comments-list').append(template);
            }
        },'json');




    });
</script>
</html>
